import { css } from './styles.js';
import { render } from './html.js';
import * as scripts from './scripts.js';
import '@shoelace-style/shoelace/dist/components/button/button.js';
import '@shoelace-style/shoelace/dist/components/input/input.js';
import '@shoelace-style/shoelace/dist/components/icon/icon.js';
import '@shoelace-style/shoelace/dist/components/icon-button/icon-button.js';
import '@shoelace-style/shoelace/dist/components/alert/alert.js';
import '../../../utils/shoelace-config.js';

class EmailRegister extends HTMLElement {
    constructor() {
        super();
        this.attachShadow({ mode: 'open' });
        
        // 初始化状态
        this.isOpen = false;
        this.isLoading = false;
        
        // 渲染组件
        this.render();
        this.bindEvents();
    }

    render() {
        this.shadowRoot.innerHTML = `
            <style>${css}</style>
            ${render()}
        `;
    }

    bindEvents() {
        scripts.bindEvents(this.shadowRoot, this);
    }

    openModal() {
        this.isOpen = true;
        scripts.openModal(this.shadowRoot);
    }

    closeModal() {
        this.isOpen = false;
        scripts.closeModal(this.shadowRoot);
    }

    async handleRegister() {
        await scripts.handleRegister(this.shadowRoot, this);
    }

    async simulateRegister(email, password, confirmPassword, verificationCode) {
        return await scripts.simulateRegister(email, password, confirmPassword, verificationCode);
    }

    handleRegisterSuccess(userData) {
        scripts.handleRegisterSuccess(userData, this.shadowRoot, this);
    }

    handleRegisterError(errorMessage) {
        scripts.handleRegisterError(errorMessage, this.shadowRoot, this);
    }

    async handleSendCode() {
        await scripts.handleSendCode(this.shadowRoot, this);
    }

    handleLoginLink() {
        scripts.handleLoginLink(this);
    }



    validateForm() {
        return scripts.validateForm(this.shadowRoot, this);
    }

    validateEmail() {
        return scripts.validateEmail(this.shadowRoot, this);
    }

    validatePassword() {
        return scripts.validatePassword(this.shadowRoot, this);
    }

    showError(errorElement, message) {
        scripts.showError(errorElement, message);
    }

    hideError(errorElement) {
        scripts.hideError(errorElement);
    }

    showSuccess(message) {
        scripts.showSuccess(message, this.shadowRoot);
    }

    clearErrors() {
        scripts.clearErrors(this.shadowRoot);
    }

    resetForm() {
        scripts.resetForm(this.shadowRoot);
    }

    setLoading(loading) {
        this.isLoading = loading;
        scripts.setLoading(loading, this.shadowRoot);
    }

    open() {
        this.openModal();
    }

    close() {
        this.closeModal();
    }
}

window.customElements.define('email-register', EmailRegister);